import React, { Component } from 'react'
import { NavBar, InputItem, Button,Toast } from 'antd-mobile';
import { Link } from "react-router-dom"
import { reqLogin, reqRegister } from '../../http/api';
import { connect } from "react-redux";
import { actions, getUser } from "../../store/modules/register";
import { bindActionCreators } from "redux";
class Register extends Component {
    render() {
        let { user,register:{changeUser,registerAction} ,history:{push}} = this.props;
        return (

            <div className="nav">

                <NavBar>注册</NavBar>
                {JSON.stringify(user)}
                <InputItem
                    clear
                    placeholder="请输入账号"
                    onChange={(value) => changeUser("phone",value)}

                >手机号</InputItem>
                <InputItem
                    clear
                    placeholder="请输入昵称"
                    onChange={(value) =>changeUser("nickname",value )}

                >昵称</InputItem>
                <InputItem
                    clear
                    placeholder="请输入密码"
                    type="password"
                    onChange={(value) =>changeUser( "password",value)}

                >密码</InputItem>
                <div style={{ width: "33.33%", margin: "10px auto" }}>
                    <Button type="primary" onClick={() =>registerAction(push)}>注册</Button></div>
                    <Link to="/login">已有账号，去登录</Link> 
            </div>
        )
    }
}

const mapStateToProps = (state, ownProps) => {
    console.log(state);
    return {
      user: getUser(state),
    };
  };
  const mapDispatchToProps = (dispatch, ownProps) => {
    return {
      register: bindActionCreators(actions, dispatch),
    };
  };
  export default connect(mapStateToProps, mapDispatchToProps)(Register);
